<!-- 物流单评价查看 -->
<template>
    <div class="evaluation">
            <van-nav-bar
      title="商品订单"
      left-arrow
      @click-left="onClickLeft"
    />
    <!-- 搜索框 -->
   <form action="/">
    <van-search
    v-model="value"
    show-action
    placeholder="请输入搜索关键词"
    @search="onSearch"
    @cancel="onCancel"
    action-text='搜索'
  />
</form>
<div v-for="(item,index) in complete" :key="index" class="conts">
    <div class="commodity">
        <span>快递单号：{{item.belongUser}}</span>
        <a href="#">&gt;</a>
    </div>
          <van-card
               :desc="`下单时间：`+item.createTime"
               :title="item.cusName"
               thumb="https://img01.yzcdn.cn/vant/ipad.jpeg">
                  <template #tags class="commoditys">
                    <van-tag plain type="danger">下单人：</van-tag>
                    <van-tag plain type="danger">{{item.consignor}}</van-tag><br>
                     <van-tag plain type="danger">送货人:</van-tag>
                    <van-tag plain type="danger">{{item.consignee}}</van-tag>
                  </template>
                  <template #footer>
                    <!-- <van-button size="mini">发货</van-button> -->
                   <div class="bottom">
                   <span
                    :class="item.star == 0? 'span' : 'sapn1'" @click="appraiseClick(item)">
                  {{item.star == 0 ? "评价":"查看评价"
                }}</span
              >
            </div>
                  </template>
                </van-card>
   </div>
   
    </div>
</template>

<script>
import {GetStar} from '@/raxios/api'
export default {
    data () {
        return {
            value:'',
            complete:[],
            
 
        }
    },
    props:['title'],
    
    created(){
        let val=this.title
        console.log(val);
        //   console.log(item.orderCode);

    GetStar({current:'1',size:'10',keyword:''}).then(res=>{
        this.complete=res.data.records
        console.log(res);
        // console.log(complete);
        // console.log(res.data.records);
    })
 },
 methods:{
    //  需要评价
      appraiseClick(item) {
      if (item.star != 0) {
        // this.$router.push("/AppraiseClick?serialNo=" + serialNo);
        this.$router.push({
          path: "/eoappraiseClick",query: { id: item.id},});
      } else {
        // 查看评价
        this.$router.push({
          path: "/eoyiComment",
          query: { id: item.id, orderCode:item.orderCode},
        });
        
      }
    },
    onClickLeft() {
      this.$router.push('/home')
    },
    onSearch(val) {//键盘事件
     
    },
    onCancel() {//点击搜索
      
     
    },
 }
}
</script>
 
<style lang = "less" scoped>
.evaluation{
    width: 100%;
    height: 100%;
    position: fixed;
    bottom: 0;
    left: 0;
    z-index: 99;
    overflow: scroll;
    background-color: #efefef;
}
   .commodity{
        height: 0.3rem;
        border-bottom: 1px solid #ccc;
        line-height: 0.3rem;
        background-color: #fff;
        display: flex;
        justify-content: space-between;
        padding: .1rem 0.2rem;
        font-size: 0.14rem;
        }
.conts{
    margin-top: 0.1rem;
}
    .van-card__header{
        border-bottom: 1px solid #ccc;
    }
    /deep/.van-tag--plain::before{
        border: none;
    }
    .van-tag{
    color: #646566;
    }
  /deep/.van-card{
      background-color: #fff;
  }
      .bottom {
      height: 0.5rem;
      background-color: #fff;
      span {
        float: right;
        width: 0.7rem;
        height: 0.3rem;
        line-height: 0.3rem;
        text-align: center;
        background-color: #ffcc33;
        border-radius: 0.3rem;
        color: #fff;
        margin: 0.1rem 0.1rem;
      }
      .span1 {
        float: right;
        width: 0.7rem;
        height: 0.3rem;
        line-height: 0.3rem;
        text-align: center;
        background-color: #ffcc33;
        border-radius: 0.3rem;
        color: #fff;
        margin: 0.1rem 0.1rem;
      }
      .span2 {
        float: right;
        width: 0.7rem;
        height: 0.3rem;
        line-height: 0.3rem;
        text-align: center;
        background-color: #fff;
        border: 1px solid #003399;
        border-radius: 0.3rem;
        color: #003399;
        margin: 0.1rem 0.1rem;
      }
      .span3 {
        float: right;
        width: 0.7rem;
        height: 0.3rem;
        line-height: 0.3rem;
        text-align: center;
        background-color: #fff;
        border: 1px solid #ffcc33;
        border-radius: 0.3rem;
        color: #ffcc33;
        margin: 0.1rem 0.1rem;
      }
    }
    /deep/.van-nav-bar__content{
        background-color: #003399;
        height: 0.6rem;
        color: #fff;

    }
    .van-card:not(:first-child){
        margin: 0;
    }
    /deep/.van-nav-bar__title{
        color: #fff;
    }
</style>